//首页的样式设置
#wrap {
    width: 7.5rem;
    margin: 0 auto;

    // 头部
    header {
        width: 100%;
        background: #ff6040;

        .top {

            display: flex;
            align-items: center;
            justify-content: space-between;

            h2 {
                width: 1.88rem;
                color: #fff;
                font-size: 0.32rem;
            }

            .rv-search {
                width: 4rem;
                background: #ff6040;
            }

            span {
                font-size: 0.3rem;
                color: #fff;
                margin-left: 0.8rem;
            }
        }
    }

    // 新人专享
    .getnew {
        width: 100%;
        background: linear-gradient(180deg, #FF7058, #FFDED7);
        overflow: hidden;
        padding-bottom: 0.2rem;

        .title {
            margin: 0.2rem 0;

            h1 {
                color: #fff5d0;
                font-size: 0.3rem;
                float: left;
            }

            .time {
                line-height: 0.23rem;
                color: #fff5d0;
                line-height: 0.33rem;
                margin: 0.05rem 0 0 0.5rem;
                float: left;
                font-size: 0.3rem;

                span {
                    width: 0.3rem;
                    height: 0.33rem;
                    border-radius: 0.04rem;
                    font-size: 0.2rem;
                    background: #fff5d0;
                    color: #83480a;
                    display: inline-block;
                    text-align: center;
                }
            }

            p {
                width: 1.2rem;
                height: 0.45rem;
                background: #fff5d0;
                text-align: center;
                line-height: 0.45rem;
                color: #83480a;
                font-size: 0.16rem;
                border-radius: 0.25rem;
                float: right;

            }
        }

        // 一重礼,二重礼-也就是万人团
        .one,
        .two {
            width: 100%;

            .gift {
                width: 100%;
                background-color: #fff;
                border-radius: 0.2rem;
                padding: 0.1rem;
                box-sizing: border-box;

                .onegift {
                    display: flex;
                    align-items: center;

                    h2 {
                        width: 1.2rem;
                        height: 0.4rem;
                        background: linear-gradient(180deg, #FF6040, #FF8A80);
                        border-radius: 0.2rem;
                        text-align: center;
                        line-height: 0.4rem;
                        color: #fff;
                        margin-right: 0.3rem;
                    }

                    p {
                        color: #FF7058;
                        font-size: 0.16rem;

                        span {
                            font-size: 0.12rem;
                        }
                    }
                }

                ul {
                    margin-top: 0.3rem;
                    white-space: nowrap;
                    overflow: scroll;
                    display: flex;
                    flex-wrap: nowrap;
                    align-items: center;
                    overflow-x: scroll;
                    overflow-y: hidden;
                    white-space: nowrap;

                    li {
                        width: 2rem;
                        background: linear-gradient(180deg, #FF8A80, #FF6040);
                        border-radius: 0.2rem;
                        padding: 0.1rem;
                        margin-right: 0.1rem;

                        img {
                            width: 2rem;
                            height: 2rem;
                            border-radius: 0.2rem;
                        }

                        h3 {
                            width: 1.8rem;
                            font-size: 0.18rem;
                            color: #fff;
                            overflow: hidden;
                            text-overflow: ellipsis;
                            white-space: nowrap;
                            margin-top: 0.1rem;
                        }

                        p {
                            margin: 0.1rem 0;
                            color: #fff;
                            font-size: 0.18rem;

                            s {
                                color: #ccc;
                            }

                            span {
                                width: 0.3rem;
                                height: 0.3rem;
                                border-radius: 50%;
                                background: #fff;
                                text-align: center;
                                line-height: 0.3rem;
                                color: #FF6040;
                                float: right;
                                font-size: 0.2rem;
                                margin-right: 0.1rem;

                            }
                        }

                    }
                }
            }
        }


        .two {
            margin-top: 0.3rem;
        }
    }

    //下面所有的商品和选项
    #allbox {
        width: 100%;
        background: #f2f2f2;

        // 那一排的icon
        .icon {
            margin: 0.3rem 0;

            .rv-badge__wrapper {
                color: #FF6040;

                .rv-grid-item__icon {
                    font-size: 0.3rem;
                }
            }

            .rv-grid-item__text {
                font-size: 0.18rem;
            }
        }

        //超级秒杀
        .seckill {
            width: 100%;
            height: 4rem;
            background: linear-gradient(180deg, #FF6040, #FF7B65);
            border-radius: 0.2rem;
            padding: 0.1rem;
            box-sizing: border-box;

            .title {
                display: flex;
                align-items: center;

                h2 {
                    color: #fff5d0;
                    font-size: 0.3rem;
                    margin-right: 0.2rem;
                }

                p {
                    line-height: 0.4rem;
                    color: #fff5d0;
                    font-size: 0.2rem;

                    span {
                        display: inline-block;
                        width: 0.4rem;
                        height: 0.4rem;
                        background: #fff5d0;
                        border-radius: 0.1rem;
                        color: #83480a;
                        text-align: center;
                        margin: 0.05rem;

                    }
                }
            }

            .content {
                width: 100%;
                height: 3rem;
                background: #fff;
                margin-top: 0.3rem;
                border-radius: 0.2rem;
                padding: 0.2rem;
                box-sizing: border-box;
                display: flex;
                justify-content: space-between;

                img {
                    width: 2.6rem;
                    height: 2.6rem;
                    border-radius: 0.2rem;
                }

                .rightbox {
                    width: 3.5rem;

                    h2 {
                        color: #000;
                        font-size: 0.28rem;
                        display: -webkit-box;
                        /** 对象作为伸缩盒子模型显示 **/
                        -webkit-box-orient: vertical;
                        /** 设置或检索伸缩盒对象的子元素的排列方式 **/
                        -webkit-line-clamp: 2;
                        /** 显示的行数 **/
                        overflow: hidden;
                    }

                    div {
                        width: 3rem;
                        height: 0.5rem;
                        margin: auto;
                        background: #ffedba;
                        margin-top: 1rem;
                        border-radius: 0.2rem;
                        display: flex;
                        align-items: center;

                        .money {
                            width: 70%;
                            color: #fe3a21;
                            font-size: 0.16rem;
                            text-align: center;

                            span {
                                font-size: 0.2rem;
                            }
                        }

                        .gobuy {
                            width: 30%;
                            height: 0.5rem;
                            text-align: center;
                            line-height: 0.5rem;
                            border-radius: 0.2rem;
                            color: #fff;
                            font-size: 0.2rem;
                            background: #fe3a21
                        }
                    }

                }
            }
        }

        //限时秒杀
        .spike {
            margin-top: 0.3rem;

            .gift {
                width: 100%;
                background: linear-gradient(180deg, #FF6040, #FF7B65);
                border-radius: 0.2rem;
                padding: 0.1rem;
                box-sizing: border-box;

                .onegift {
                    display: flex;
                    align-items: center;

                    h2 {
                        width: 1.2rem;
                        height: 0.4rem;
                        background: #ffedba;
                        border-radius: 0.2rem;
                        text-align: center;
                        line-height: 0.4rem;
                        color: #FF6040;
                        margin-right: 0.3rem;
                    }

                    p {
                        color: #ffedba;
                        font-size: 0.16rem;

                        span {
                            font-size: 0.12rem;
                        }
                    }
                }

                ul {
                    margin-top: 0.3rem;
                    white-space: nowrap;
                    overflow: scroll;
                    display: flex;
                    flex-wrap: nowrap;
                    align-items: center;
                    overflow-x: scroll;
                    overflow-y: hidden;
                    white-space: nowrap;

                    li {
                        width: 2rem;
                        background: #fff;
                        border-radius: 0.2rem;
                        padding: 0.1rem;
                        margin-right: 0.1rem;

                        img {
                            width: 2rem;
                            height: 2rem;
                            border-radius: 0.2rem;
                        }

                        h3 {
                            width: 1.8rem;
                            font-size: 0.18rem;
                            color: #ff6040;
                            overflow: hidden;
                            text-overflow: ellipsis;
                            white-space: nowrap;
                            margin-top: 0.1rem;
                        }

                        p {
                            margin: 0.1rem 0;
                            color: #ff6040;
                            font-size: 0.18rem;

                            s {
                                color: #ccc;
                            }

                            span {
                                width: 0.3rem;
                                height: 0.3rem;
                                border-radius: 50%;
                                background: #ff6040;
                                text-align: center;
                                line-height: 0.3rem;
                                color: #fff;
                                float: right;
                                font-size: 0.2rem;
                                margin-right: 0.1rem;

                            }
                        }

                    }
                }
            }
        }

        //选项卡名字
        .tab {
            width: 100%;
            display: flex;
            align-items: center;
            background: #FF6040;
            color: #fff;
            margin-top: 0.3rem;
            border-radius: 0.1rem;

            li {
                flex: 1;
                height: 0.5rem;
                line-height: 0.5rem;
                text-align: center;
                font-size: 0.2rem;
            }

            li:nth-child(1) {
                border-top-left-radius: 0.1rem;
                border-bottom-left-radius: 0.1rem;
            }

            li:nth-child(4) {
                border-top-right-radius: 0.1rem;
                border-bottom-right-radius: 0.1rem;
            }

            .active {
                color: #FF6040;
                background: #ffedba;
            }
        }

        //商品信息
        .items {
            width: 100%;

            li {
                border-radius: 0.2rem;
                background: #fff;
                margin-top: 0.15rem;
                padding: 0.1rem;
                box-sizing: border-box;
                display: flex;
                justify-content: space-between;

                img {
                    width: 2.6rem;
                    height: 2.6rem;
                    border-radius: 0.2rem;
                }

               .rightcon {
                    width: 4rem;
                    padding-top: 0.1rem;
                        box-sizing: border-box;

                    h2 {
                        font-size: 0.26rem;
                        margin: 0.2rem auto;
                        display: -webkit-box;
                        /** 对象作为伸缩盒子模型显示 **/
                        -webkit-box-orient: vertical;
                        /** 设置或检索伸缩盒对象的子元素的排列方式 **/
                        -webkit-line-clamp: 2;
                        /** 显示的行数 **/
                        overflow: hidden;
                    }
                    div{
                        width: 3rem;
                        display: flex;
                        align-items: center;
                        margin:auto ;
                        
                        p{
                            color: #FF6040;
                            font-size: 0.18rem;
                            margin-right: 0.2rem;
                            span{
                                font-size: 0.26rem;
                            }
                            s{
                                display: block;
                                color: #ccc;
                            }
                        }
                        button{
                            width: 1.4rem;
                            height: 0.5rem;
                            border-radius: 0.4rem;
                            font-size: 0.16rem;
                            border: none;
                            color: #fff;
                            background: linear-gradient(243deg, #FFC253, #FF6342);
                        }
                    }
                    h4{
                        float: right;
                        font-size: 0.14rem;
                        margin-right: 0.2rem;
                        margin-top: 0.4rem;
                    }
                }
            }
        }
    }

}



.type_area {
    width: 7.1rem;
    margin: 0 auto;
}

#foot {
    width: 100%;
    height: 1.2rem;
}